<template>
  <div class="content">
    <!--    数据字典公共列表弹窗-->
    <el-dialog
      v-dialogDrag
      :title="$t('market.unitList')"
      model
      :visible.sync="isclientlDialog"
      :close-on-click-modal="false"
      width="60%"
      :before-close="handleClose"
    >
      <div>
        <jc-table
          :table-data="tableData"
          :table-header="tableHeader"
          table-height="53vh"
          serial
          @clickRow="clientlSelectRow"
        >
          <!--基准计量单位-->
          <template v-slot:btnStates="col">
            <el-checkbox v-model="col.scope.row.fisbaseunit" disabled />
          </template>
        </jc-table>
        <div class="footer">
          <jc-pagination
            :total="total"
            :page.sync="pagination.pageNum"
            :limit.sync="pagination.pageSize"
            @pagination="getBasicUnit"
          />
        </div>
      </div>
    </el-dialog>
  </div>
</template>
<script>
import { queryUnitList } from '@/api/basicManagement/measuring'

export default {
  props: {
    msg: {
      type: Boolean,
      default: true
    }
  },
  data() {
    return {
      pagination: {
        pageNum: 1, // 当前页
        pageSize: 200 // 每页显示多少条数据
      },
      total: 0,
      isclientlDialog: true,
      tableData: [],
      tableHeader: [
        { label: this.$t('shop.fnumber'), prop: 'fnumber', width: '120' },
        { label: this.$t('shop.name1'), prop: 'fname' },
        { label: this.$t('market.unitGroup'), prop: 'funitgroup' },
        { label: this.$t('market.precision'), prop: 'fprecision', width: '80' },
        { label: this.$t('market.isbaseunit'), type: 'states', prop: 'fisbaseunit', width: '80' },
        { label: this.$t('market.destunit'), prop: 'fdestunit', width: '80' },
        { label: this.$t('market.molecule'), prop: 'fconvertnumerator', width: '80' },
        { label: this.$t('market.currentunit'), prop: 'fcurrentunit', width: '80' },
        { label: this.$t('market.matrixing'), prop: 'fconvertdenominator', width: '80' },
        { label: this.$t('market.note'), prop: 'fdescription', width: '200px' }
      ],
      prodValue: { fcustId: '', fname: '', isclientlDialog: true }
    }
  },
  created() {
    this.getBasicUnit()
  },
  methods: {
    // 基本单位
    async getBasicUnit() {
      const DATA = { fisbaseunit: this.msg, ...this.pagination }
      const { data: RES } = await queryUnitList(DATA)
      this.tableData = RES.array
      this.total = RES.total
    },
    // 单位选中
    clientlSelectRow(item) {
      this.prodValue = item
      this.$emit('unit', this.prodValue)
    },
    // 关闭前回调
    handleClose() {
      this.prodValue.isclientlDialog = false
      this.$emit('unit', this.prodValue)
    }
  }
}
</script>

<style scoped lang="scss">
.content {
  @include listBom;
}
</style>
